{extend name="layout"}
{block name="style"}
<style>
body{min-width: inherit;background-color: #fff;overflow-x: hidden;}
.teacher{display: none;}
.layui-layout-admin .layui-body{top:10px;}
form{padding:50px 0;}
.layui-footer{width: 100%;position: fixed;bottom: 0;padding:10px 0px;background-color: #eee;text-align: center;}
</style>
{/block}
{block name="header"}{/block}
{block name="menu"}{/block}
{block name="more"}{/block}
{block name="footer"}

{/block}
{block name="main"}
<form class="layui-form" action="" method="post">
  
  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">语言</label>
      <div class="layui-input-inline">
        <select name="lang" required lay-verify="lang" lay-filter="">
          {volist name="langs" id="vo"}
          <option value="{$vo['id']}">{$vo['title']}</option>
          {/volist}
        </select>
      </div>
    </div>
  </div>
  
  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">标题</label>
      <div class="layui-input-inline">
        <input type="text" name="title" placeholder="" required lay-verify="title" autocomplete="off" class="layui-input">
      </div>
    </div>
  </div>

  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">封面</label>
      <div class="layui-upload layui-input-inline">
        <button type="button" class="layui-btn layui-btn-primary" id="cover">上传图片</button><input class="layui-upload-file" type="file" name="cover">
        <div class="layui-upload-list">
          <img class="layui-upload-img" src="{$news['cover']?:'/static/image/upload.png'}" id="cover-img" width="120" height="68">
          <input type="hidden" name="cover" id="cover-val" value="{$system['cover']?:''}" lay-verify="cover" autocomplete="off" class="layui-input">
        </div>
        <div id="logo-err"></div>
      </div>
      <script>
        layui.use(['jquery','upload'],function(){
          var $ = layui.jquery;
          var upload = layui.upload;
          var uploadInst = upload.render({
            elem: '#cover',
            url: '{:url('upload/image')}',
            size:2*1024,
            before: function(obj){

            },
            done: function(res){
              if(res.code == 1){
                $('#cover-img').attr('src', res.src);
                $('#cover-img').css('display','block');
                $('#cover-val').val(res.src);
                return true;
              }
            },
            error: function(){
              var errText = $('#cover-err');
              errText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini logo-reload">重试</a>');
              errText.find('.cover-reload').on('click', function(){
              	errText.remove();
                uploadInst.upload();
              });
            }
          });
        });
      </script>
    </div>
  </div>

  

  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">分类</label>
      <div class="layui-input-inline">
        <select name="cid" lay-filter=""  required lay-verify="cid" >
          <option value="">请选择文章分类</option>
          {volist name="categorys" id="vo"}
          <option value="{$vo['id']}">{$vo['name']}</option>
          {/volist}
        </select>
      </div>
    </div>
  </div>

  <div class="layui-form-item">
    <div class="layui-block">
      <label class="layui-form-label">描述</label>
      <div class="layui-input-block" style="padding-right:20px;">
        <textarea type="text" name="description" placeholder="" required lay-verify="description" class="layui-textarea"></textarea>
      </div>
    </div>
  </div>

  <div class="layui-form-item">
    <div class="layui-block">
      <label class="layui-form-label">内容</label>
      <div class="layui-input-block" style="padding-right:20px;">
        <textarea type="text" id="content" name='content' required lay-verify="content" class="layui-textarea"></textarea>
      </div>
    </div>
  </div>
    
    <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">状态</label>
      <div class="layui-input-inline">
        <select name="status" required lay-verify="required" lay-filter="">
          <option value="1"  >可用</option>
          <option value="0"  >禁用</option>
        </select>
      </div>
    </div>
  </div>

  <div class="layui-footer">
    <button class="layui-btn layui-btn-normal layui-btn-small" lay-submit lay-filter="*" type="button">立即提交</button>
    <button class="layui-btn layui-btn-small layui-btn-primary" id="closeFrame" type="button">完成/取消</button>
  </div>

</form>
<script>
  layui.use(['layer','jquery','form','layedit'],function(){
    var $ = layui.jquery;
    var form = layui.form;
    var layedit = layui.layedit;

    layedit.set({
    	uploadImage:{
    		url: '{:url('upload/articleImage')}',type:'post'
    	}
    })
    var editIndex = layedit.build('content');

    form.verify({
      lang:function(value){if(value.length < 1){return '请选择语言';}},
      title:function(value){if(value.length < 1){return '标题不能为空';}},
      cover:function(value){if(value.length < 1){return '请上传图片';}},
      cid:function(value){if(value.length < 1){return '请选择分类';}},
      description:function(value){if(value.length < 1){return '描述内容不能为空';}},
      content:function(value){if(value.length < 1){return '请输入内容';}},
      content:function(value){layedit.sync(editIndex);}
    });
    //监听提交
    form.on('submit(*)', function(data){
      data.form.submit();
      return true;
    });
    $('#closeFrame').on('click',function(){
      parent.layer.closeAll();
    })
    $('#addData').on('click',function(){
      $('form').submit();
    })
  });
</script>
{/block}
{block name="script"}
{/block}
